<template>
    <div class="inputBox">
        <span class="star">*</span>
        <span class="textName">{{ name }}内容</span>
        <div>
            <input type="text" v-bind:placeholder='"请输入"+name' v-bind:value="value" @input="(e)=>{
                $emit('titleChange',e.target.value)
            }"></input>
        </div>
    </div>
</template>

<script setup>
    const props = defineProps(['name','value'])
</script>

<style scoped>
    .inputBox{
        line-height: 12px;
        font-size: 12px;
        height: 20px;
        margin-bottom: 3vh;
        padding-right: 1vw;
    }

    .inputBox input{
        height: 12px;
        border: 0;
        line-height: 12px;
        outline: none;
    }

    .inputBox>.star{
        float: left;
        padding-top: 0.3vh;
        margin-right: 0.5vw;
        color: #ED8241;
    }

    .inputBox>textName{
        float: left;
    }

    .inputBox > div{
        float: right;
        height: 100%;
        width:17vw;
        border-bottom: 1px solid #eee;
    }
</style>